<template>
	<view class="container">
		<view>
			<uni-data-select v-model="value" :localdata="range" @change="changeStatus" :clear="isShow"
				class="selectorRange">
			</uni-data-select>
		</view>
		<view v-for="(item, index) in tableData" :key="index" class="adviceBox">
			<uni-card :title="item.studentName" :extra="item.status=='y'?'已查看':'未查看' ">

				<text class="uni-title" style="font-weight: bolder;">提交时间：</text><text
					class="uni-body">{{item.sendTime}}</text><br>
				<text class="uni-title" style="font-weight: bolder;">用药日期：</text><text
					class="uni-body">{{item.date}}</text><br>
				<text class="uni-title" style="font-weight: bolder;">用药说明：</text><text
					class="uni-body">{{item.text}}</text><br>
			</uni-card>
		</view>
		<uni-fab ref="fab" :pattern="pattern" :horizontal="horizontal" :vertical="vertical" :direction="direction"
			@fabClick="fabClick" />
	</view>

</template>

<script>
	export default {
		data() {
			return {
				studentId: '',
				status: -1,
				header: '请假记录',
				isShow: false, // 是否清空已选项
				value: -1,
				range: [{
						value: -1,
						text: "全部提醒记录"
					},
					{
						value: 'y',
						text: "已查看"
					},
					{
						value: 'n',
						text: "未查看"
					},

				],
				tableData: [],

				horizontal: 'right',
				vertical: 'bottom',
				direction: 'horizontal',
				pattern: {
					color: '#7A7E83',
					backgroundColor: '#fff',
					selectedColor: '#007AFF',
					buttonColor: '#007AFF',
					iconColor: '#fff'
				},
				childName: '',
			};
		},
		onLoad(option) {
			console.log("option : ", option)
			this.childName = option.childName;
		},
		onShow() {
			this.studentId = uni.getStorageSync('studentId');
			this.getLeaveList();
		},
		methods: {
			changeStatus(e) {
				console.log("change: ", e)
				this.status = e;
				this.getLeaveList();
			},
			getLeaveList() {
				// console.log('this.status:', this.status)
				this.$myReq({
						url: '/health/api/getByStudent/' + this.studentId ,
						method: 'get'
					})
					.then((res) => {
						console.log(res);
						this.tableData = res.data;
					})
			},
			fabClick() {
				uni.navigateTo({
					url: '../health/healthAdd/healthAdd?childName=' + this.childName
				})
			},
			check(id) {
				let that = this;
				return uni.showModal({
					title: '确定？',
					content: '确定孩子该条请假您已知情',
					success(res) {
						if (res.confirm) {
							console.log("check")
							that.$myReq({
									url: '/leave/api/' + id,
									method: 'put'
								})
								.then((res) => {
									console.log(res);
									if (res.code == 200) {
										uni.showToast({
											title: "确认成功",
											icon: 'success'
										})
										location.reload();
									}
								})
						}
					}
				})
			}
		}
	}
</script>

<style>
	.adviceBox {
		border: 1px;
		margin-top: 10px;
		margin-bottom: 10px;
		background-color: #FFFFFF;
	}

	.title {
		font-size: 18px;
		color: #000000;
	}

	.content {
		font-size: 16px;
		width: 350px;
		color: #AAAAAA;
		margin: 10px;
		white-space: nowrap;
		text-overflow: ellipsis;
		display: inline-block;
		width: 95%;
		height: auto;
		font-family: Gibson;
		font-size: 32rpx;
		word-break: break-all;
		text-overflow: ellipsis;
		word-wrap: break-word;
		white-space: pre-wrap;
	}

	.time {
		color: #DDDDDD;
		font-size: 14px;
		padding-left: 120px;
	}

	.fontButton {
		margin-bottom: 20px;
	}
</style>
